<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/vip.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.css">
    <script type="text/javascript" src="js/vip.js"></script>
    <title>会员</title>
</head>
<body>

    <div class="wrapper">
        <div id="userange" class="userange"><span>限美食、甜点饮品、超市便利、蔬菜水果使用</span></div>
<!--        顶部-->
        <div class="header-wrapper">
            <div class="header">
                <p>   </p>
                <span>美团会员</span>
                <i class="fa fa-ellipsis-h"></i>
            </div>
        </div>
<!--        主体内容部分-->
        <div class="main">
            <div class="font-part">开通会员 预计可省 <span>161</span><span> 元/月</span></div>
            <div class="card-part-wrapper">
                <div class="card-part">
                    <div class="module1"><span>每月享<span>6张</span>红包 价值<span>30元</span></span><span class="lastchild" id="lastchild" >可用范围<i class="fa fa-exclamation-circle"></i></span></div>
                    <div class="module2"><img src="img/vip-无门槛券.jpg" alt=""></div>
                    <div class="module3">更多特权</div>
                    <div class="module4">
                        <div>
                            <img src="img/vip-升级大额红包.png" alt="">
                            <p>升级大额红包</p>
                            <span>立省更多</span>
                        </div>
                        <div>
                            <img src="img/vip-加量包.png" alt="">
                            <p>加量包</p>
                            <span>优惠买红包</span>
                        </div>
                        <div>
                            <img src="img/vip-免配红包.png" alt="">
                            <p>免配红包</p>
                            <span>最高减10元</span>
                        </div>
                        <div>
                            <img src="img/vip-单车畅骑卡.png" alt="">
                            <p>单车畅骑卡</p>
                            <span>7天免费骑</span>
                        </div>
                        <div>
                            <img src="img/vip-电单车周卡.png" alt="">
                            <p>电单车周卡</p>
                            <span>3次免费骑</span>
                        </div>
                        <div>
                            <img src="img/vip-会员客服.png" alt="">
                            <p>会员客服</p>
                            <span>贴心服务</span>
                        </div>
                        <div>
                            <img src="img/vip-跑腿红包.png" alt="">
                            <p>跑腿红包</p>
                            <span>3元帮送券</span>
                        </div>
                        <div>
                            <img src="img/vip-火车票加速卡.png" alt="">
                            <p>火车票加速卡</p>
                            <span>价值70元</span>
                        </div>
                        <div>
                            <img src="img/vip-汽车票红包.png" alt="">
                            <p>汽车票红包</p>
                            <span>2元红包</span>
                        </div>
                        <div>
                            <img src="img/vip-美团机票红包.png" alt="">
                            <p>美团机票红包</p>
                            <span>5元无门槛</span>
                        </div>
                        <div>
                            <img src="img/vip-优选专区.png" alt="">
                            <p>优选专区</p>
                            <span>会员精选好物</span>
                        </div>
                        <div>
                            <img src="img/vip-会员日.png" alt="">
                            <p>会员日</p>
                            <span>专属折扣菜</span>
                        </div>
                        <div>
                            <img src="img/vip-收起全部.png" alt="">
                            <p>收起全部</p>
                        </div>
                    </div>
                    <div class="module5-wrapper">
                        <div class="module5"><span>¥</span>15 <span>开通会员</span></div>
                    </div>

                    <div class="module6"><p>放心开通，不自动续费</p></div>
                    <div class="module7"><p>购买即视为同意<span>《美团会员服务协议》</span> | 会员规则<i class="fa fa-question-circle-o"></i></p></div>
                </div>
            </div>

        </div>
<!--        底部菜单栏-->
        <div class="footer-wrapper">
            <div class="footer">
                <div onclick="window.location.href='index.html' ">
                    <i class="fa fa-home fa-3x"></i>
                    <span>首页</span>
                </div>
                <div onclick="window.location.href='vip.html' ">
                    <i class="fa fa-vimeo fa-3x"></i>
                    <span>会员</span>
                </div>
                <div onclick="window.location.href='order.html' ">
                    <i class="fa fa-file-text-o fa-3x"></i>
                    <span>订单</span>
                </div>
                <div  onclick="window.location.href='mine.html' ">
                    <i class="fa fa-user fa-3x"></i>
                    <span>我的</span>
                </div>
            </div>
        </div>

    </div>
</body>
</html>